<template>
	<view class="party">
		<view class="hd_jn" @click="jnshowfun">
			<image src="/static/images/hd_jn.png"></image>
			<view class="hd_jn-text">
				活动规则
			</view>
		</view>
		<view class="party-bc">

			<image :src="imgurl+inpayimg" mode="widthFix"></image>
		</view>
		<view class="party-view" v-if="subjectList.length>0">
			<!-- <view class="party-icon" v-if="subjectList[topicindex].titleType==1">
				<image src="/static/images/icon_wh.png" mode="widthFix"></image>
				
			</view> -->
			<view class="party-view-top"
				:style="{'color':subjectList[topicindex]&&subjectList[topicindex].subjectTitleColor?subjectList[topicindex].subjectTitleColor:'#ffffff'} ">
				{{subjectList[topicindex]&&subjectList[topicindex].subjectTitle}}
			</view>

			<!-- subjectType 题目类型 1:单选题 2:填空题 -->
			<!-- titleType 标题类型  1:文本 2:图片 3:视频 4:音频 -->
			<view class=" text-images" v-if="subjectList[topicindex]&&subjectList[topicindex].titleType==2"
				@click="goimg(subjectList[topicindex].subjectImagelist)">
				<!-- {{imgurl+subjectList[topicindex].subjectImage}} -->
				<u-swiper :list="subjectList[topicindex].subjectImagelist" @click="swiperfun"></u-swiper>
				<!-- <image :src="imgurl + subjectList[topicindex].subjectImage" mode="widthFix"></image> -->
			</view>
			<view class="page-section page-section-gap" style="text-align: center;"
				v-if="subjectList[topicindex]&&subjectList[topicindex].titleType==4">
				<audio style="text-align: left" :src="imgurl + subjectList[topicindex].subjectFile" :poster="''"
					:name="'音频资料'" :author="''" :action="audioAction" controls></audio>
			</view>
			<video id="myVideo" v-if="subjectList[topicindex]&&subjectList[topicindex].titleType==3"
				:src="imgurl + subjectList[topicindex].subjectFile" @timeupdate="bindtimeupdate"></video>

			<view class="text-input" v-if="subjectList[topicindex].subjectType==2">
				<u-input v-model="subjectList[topicindex].content" type="textarea" axlength="300" placeholder="请输入"
					height="200" :auto-height="true"
					:custom-style="{'backgroundColor':'#ffffff','borderRadius': '25rpx',}" />
			</view>


			<view class="select-text"
				v-for="(item,index) in subjectList[topicindex]&&subjectList[topicindex].optionList" :key="index"
				@click="optionselectfun(index)" v-if="subjectList[topicindex]&&subjectList[topicindex].subjectType==1">
				<view class="select-text-left">
					<view class="select-text-titleicon">
						<image src="/static/images/icon_noselect.png" v-if="!item.select"></image>
						<image src="/static/images/icon_select.png" v-if="item.select"></image>
					</view>
					<view class="select-text-title"
						:style="{'color':subjectList[topicindex]&&subjectList[topicindex].optionList&&subjectList[topicindex].optionList[index].optionTitleColor?subjectList[topicindex].optionList[index].optionTitleColor:'#000000'}">
						{{item.optionTitle}}
					</view>
				</view>
				<view class="select-text-right">
					<image src="/static/images/icon_yes.png"
						v-if="subjectList[topicindex].select&&item.optionAnswer==1&&isshowtthree"></image>
					<image src="/static/images/icon_no.png"
						v-if="subjectList[topicindex].select&&item.optionAnswer==0&&item.select&&isshowtthree"></image>
				</view>
			</view>
			<view class="select-text"
				v-for="(item,index) in subjectList[topicindex]&&subjectList[topicindex].optionList" :key="index"
				@click="optionselectfun(index)" v-if="subjectList[topicindex]&&subjectList[topicindex].subjectType==3">
				<view class="select-text-left">
					<view class="select-text-titleicon">
						<image src="/static/images/icon_noselect.png" v-if="!item.select"></image>
						<image src="/static/images/icon_select.png" v-if="item.select"></image>
					</view>
					<view class="select-text-title"
						:style="{'color':subjectList[topicindex]&&subjectList[topicindex].optionList&&subjectList[topicindex].optionList[index].optionTitleColor?subjectList[topicindex].optionList[index].optionTitleColor:'#000000'}">
						{{item.optionTitle}}
					</view>
				</view>
				<view class="select-text-right">
					<!-- <image src="/static/images/icon_yes.png"
						v-if="subjectList[topicindex].select&&item.optionAnswer==1&&item.select&&isshowtthree"></image> -->
					<image src="/static/images/icon_yes.png"
						v-if="subjectList[topicindex].select&&item.optionAnswer==1&&isshowtthree"></image>
					<image src="/static/images/icon_no.png"
						v-if="subjectList[topicindex].select&&item.optionAnswer==0&&item.select&&isshowtthree"></image>
				</view>
			</view>
			<view class="bt-k" v-if="!isshowtthree&&subjectList.length-1>topicindex">
				<!-- <u-button size="medium" @click="lastfun">上一题 </u-button> -->
				<!-- <view>

				</view> -->
				<u-button size="default" @click="nextfun">下一题</u-button>
			</view>
			<view class="bt-ktj" v-if="subjectList.length-1==topicindex">
				<u-button size="default" @click="submitfun">提交 </u-button>

			</view>

		</view>



		<!-- <view class="bt-dk" @click="cjfun" v-if="reachFlag==1">
			达标打卡
		</view> -->

		<!-- 	<view class="popup" v-if="showpopup">
			<view class="popup-k">
				<image src="/static/images/Popup.png" mode="widthFix"></image>
				<view class="bt">
					进入商场
				</view>
			</view>
			
		</view> -->
		<!-- <u-popup  v-model="showpopup" mode="center" border-radius="45"  @close="failclose" @open="failopen" :closeable="true" :overlay="true">
		      <view class="fail-k fail-kan">
				  
				  <view class="fail-image-icon">
				  	<image src="/static/images/icom-wx.png" ></image>
				  </view>
		         <view class="fail-title">
		          	等待审核
		          </view>
					 <view class="fail-content">
					 	审核时间为24小时内，审核通过后，<br>
                       可通过首页活动列表去往商城
					 </view>
					 <view class="fail-bt" @click="goshop">
					 	进入商场
					 </view>
					 <view class="fail-bt-new" @click="goshop">
					 	再来一次
					 </view>
		      </view>
		 	</u-popup> -->

		<u-popup v-model="showpopup" mode="center" border-radius="45" @close="failcloseout" @open="failopen"
			:closeable="true" :overlay="true">
			<view class="fail-k fail-kan">

				<view class="fail-image-icon">
					<image src="/static/images/icom-wx.png"></image>
				</view>
				<view class="fail-title">
					等待审核
				</view>
				<view class="fail-content">
					审核时间为24小时内，审核通过后，<br>
					可通过首页活动列表去往商城
				</view>
				<view class="fail-bt" @click="gohome">
					去首页
				</view>
				<!-- <view class="fail-bt-new" @click="gorest">
					再来一次
				</view> -->
			</view>
		</u-popup>
		<u-popup v-model="showpopupsuccess" mode="center" border-radius="45" @close="failclosesuccess" @open="failopen"
			:closeable="true" :overlay="true">
			<view class="fail-k fail-kan showpopupsuccess">

				<view class="fail-image-icon showpopupsuccess-icon">
					<image src="/static/images/icom-wx.png"></image>
				</view>
				<view class="fail-title">
					{{successFlag==0?'挑战失败':"挑战成功"}}
				</view>
				<view class="fail-num">
					{{rewardPoint}}分
				</view>
				<view class="fail-max" v-if="surplusJoinNum>0">
					您还可以参与{{surplusJoinNum}}次
				</view>
				<!-- <view class="fail-content">
							 	审核时间为24小时内，审核通过后，<br>
				               可通过首页活动列表去往商城
							 </view> -->
				<view class="fail-bt" @click="golist" v-if="successFlag==0">
					再次作答
				</view>
				<view class="fail-bt-new" @click="goshop" v-if="successFlag==1">
					去商城
				</view>

				<!-- v-if="successFlag==0&&surplusJoinNum>0" -->
				<view class="fail-bt-new" @click="gorest">
					再次挑战
				</view>
			</view>
		</u-popup>

		<u-popup v-model="failshow" mode="center" border-radius="45" @close="failclose" @open="failopen"
			:closeable="true" :overlay="true">
			<view class="fail-k ">

				<view class="fail-title">
					温馨提示
				</view>
				<view class="fail-content">
					您已参与，且积分已发放
				</view>
				<view class="fail-bt">
					查看积分
				</view>
			</view>
		</u-popup>

		<u-popup v-model="noinshow" mode="center" border-radius="45" @close="failclose" @open="failopen"
			:closeable="true" :overlay="true">
			<view class="fail-k">
				<view class="fail-title">
					对不起暂无活动资格
				</view>
				<view class="fail-content">
					请联系客服咨询
				</view>
				<view class="fail-bt" @click="gohome">
					首页
				</view>

			</view>
		</u-popup>
		<u-popup v-model="norsshow" mode="center" border-radius="35" @close="failclose" @open="failopen"
			:closeable="true" :overlay="true">
			<view class="fail-k">
				<view class="fail-title">
					温馨提示
				</view>
				<view class="fail-content">
					活动人数已满
				</view>
				<view class="fail-bt" @click="gohome">
					首页
				</view>
			</view>
		</u-popup>
		<u-popup v-model="jnshow" mode="center" border-radius="35" :closeable="true" :overlay="true">
			<view class="fail-k jnshow-k">
				<view class="fail-title jnshow-title">
					活动介绍
				</view>
				<view class="fail-content jnshow-content" v-html="shuoming">
					<!-- {{}} -->
				</view>

			</view>
		</u-popup>

		<u-popup v-model="payshow" mode="center" border-radius="10" :mask-close-able="false" :closeable="false"
			:overlay="true">
			<view class="fail-k payshow-k">
				<view class="fail-title jnshow-title">
					活动介绍
				</view>
				<view class="fail-content jnshow-content" v-html="shuoming">
					<!-- {{}} -->
				</view>
				<view class="payshow-bt">
					<button @click="()=>{payshow=false}">我已知晓以上活动内容</button>
				</view>
			</view>
		</u-popup>

		<u-popup v-model="textshow" mode="bottom" border-radius="35" @close="closesb" :closeable="true" :overlay="true">
			<view class="fail-list-text">
				<text>{{textcontent}}</text>

			</view>
		</u-popup>
	</view>


</template>


<script>
	import {
		getSessionKey,
		grantWxStep,
		getActivityDetails,
		beginActivity,
		submitAnswer
	} from "@/api/index/index";
	import {
		BASE_URL_IMAHE
	} from "../../../utils/https";

	const app = getApp();
	export default {
		data() {
			return {
				imgurl: BASE_URL_IMAHE,
				historyTime: 0,
				form: {},
				showpopup: false,
				showpopupsuccess: false,
				jumpShopLink: "",
				noinshow: false,
				failshow: false,
				norsshow: false,
				sectionInfo: {
					type_config: {
						video_url: ""
					}
				},
				jnshow: false,
				inpayimg: "",
				whiteListId: "",
				joinRecordId: "",
				token: '',
				topicindex: 0,
				subjectList: [],
				audioAction: {
					method: 'pause'
				},
				surplusJoinNum: 0,
				rewardPoint: 0,
				successFlag: 0,
				resttype: false,
				shuoming: '',
				payshow: true,
				isshowtthree: false,
				textshow: false,
				textcontent: '',


			}
		},
		onLoad(options) {
			var sjs = this.randomWord()
			var datatime = Date.parse(new Date());
			var tokens = '' + sjs + '' + datatime
			this.token = tokens
			//   this.type=uni.getStorageSync("type")
			//   this.form.v=uni.getStorageSync("v")
			if (!options.activityId) {
				// 跳转回原页面
				if (getCurrentPages().length == 1) {
					uni.reLaunch({
						url: "/pages/index/index"
					})
				} else {
					uni.navigateBack({
						delta: 1,
					});
				}


			} else {
				this.form.activityId = options.activityId
				this.form.userRef = uni.getStorageSync("userRef")
				this.getlist()
			}





		},
		methods: {
			closesb() {
				this.textshow = false
			},
			failopen() {

			},
			bh(index1, index2) {

			},
			jnshowfun() {
				this.jnshow = true
			},
			goimg(img) {
				// 预览图片
				uni.previewImage({
					urls: img,
					longPressActions: {
						itemList: ['发送给朋友', '保存图片', '收藏'],
						success: function(data) {
							console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
						},
						fail: function(err) {
							console.log(err.errMsg);
						}
					}
				});
			},
			optionselectfun(index) {

				if (this.isshowtthree) {
					return
				}
				let isselect = this.subjectList[this.topicindex].select
				if (this.subjectList[this.topicindex] && this.subjectList[this.topicindex].subjectType == 1 && this
					.subjectList[this.topicindex].select) {

					this.subjectList[this.topicindex].optionList.forEach((element2, index2) => {
						element2.select = false

					})
					this.subjectList[this.topicindex].optionList[index].select = true

					// if (this.subjectList[this.topicindex].select && !this.subjectList[this.topicindex].optionList[index]
					// 	.select) {
					// 	uni.showToast({
					// 		title: "此题为单选题请取消选择，再作答",
					// 		icon: "none"
					// 	})
					// 	return

					// } else {
					// 	this.subjectList[this.topicindex].optionList[index].select = false
					// 	this.subjectList[this.topicindex].select = false
					// }
				}
				// if (this.subjectList[this.topicindex].select && this.subjectList[this.topicindex].subjectType == 3 && this
				// 	.isshowtthree) {
				// 	uni.showToast({
				// 		title: "此题已作答",
				// 		icon: "none"
				// 	})
				// 	return
				// }
				if (!isselect && this.subjectList[this.topicindex] && this.subjectList[this.topicindex].subjectType == 1) {
					this.subjectList[this.topicindex].select = true
					if (this.subjectList[this.topicindex] && this.subjectList[this.topicindex].subjectType == 1) {
						// this.subjectList[this.topicindex].optionList.forEach((element2, index2) => {

						// 	element2.select = false
						// 	this.subjectList[this.topicindex].optionList[index].select = true

						// })
						this.subjectList[this.topicindex].optionList[index].select = true

					}
					return

				}




				if (this.subjectList[this.topicindex] && this.subjectList[this.topicindex].subjectType == 3) {
					this.subjectList[this.topicindex].select = true
					// if(){

					// }
					// this.subjectList[this.topicindex].optionList[index].selectindex.push(this.subjectList[this.topicindex].optionList[index].id)
					this.subjectList[this.topicindex].optionList[index].select = !this.subjectList[this.topicindex]
						.optionList[index].select
				}


				// setTimeout(() => {
				// 	if(this.subjectList[this.topicindex].subjectType==1){
				// 		this.nextfun()
				// 	}

				// }, 1500)
			},
			swiperfun(index) {
				console.log(index)
				let that = this
				uni.previewImage({
					urls: [that.subjectList[that.topicindex].subjectImagelist[index]],
					longPressActions: {
						itemList: ['发送给朋友', '保存图片', '收藏'],
						success: function(data) {
							console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
						},
						fail: function(err) {
							console.log(err.errMsg);
						}
					}
				});
			},
			lastfun() {
				if (this.topicindex <= 0) {
					uni.showToast({
						title: "请做题，已是第一题",
						icon: "none"
					})
					this.topicindex = 0
					return
				}
				this.topicindex--
			},
			nextfun(type = 1) {
				if (type == 2) {
					if (this.subjectList[this.topicindex].subjectType == 3 || this.subjectList[this.topicindex]
						.subjectType ==
						1) {
						this.isshowtthree = true

					} else {
						this.isshowtthree = false
					}
					return

				}


				if (this.subjectList[this.topicindex] && this.subjectList[this.topicindex].subjectType == 1) {
					if (!this.subjectList[this.topicindex].select) {
						uni.showToast({
							title: "请先完成题目",
							icon: "none"
						})
						return
					}
				} else if (this.subjectList[this.topicindex] && this.subjectList[this.topicindex].subjectType == 2) {
					if (!this.subjectList[this.topicindex].content) {
						uni.showToast({
							title: "请先完成题目",
							icon: "none"
						})
						return
					}

					if (this.subjectList[this.topicindex].content && this.subjectList[this.topicindex].sensitiveWords) {
						let arr = this.subjectList[this.topicindex].sensitiveWords.split('、')
						let ismg = this.containsArrayValue(this.subjectList[this.topicindex].content, arr)
						if (ismg) {
							uni.showToast({
								title: "答题内容包含了敏感词，请修改后再提交",
								icon: "none"
							})
							return
						}


					}
				} else if (this.subjectList[this.topicindex] && this.subjectList[this.topicindex].subjectType == 3) {

					if (!this.subjectList[this.topicindex].select) {
						uni.showToast({
							title: "请先完成题目",
							icon: "none"
						})
						return
					}
				}


				if (this.topicindex >= this.subjectList.length - 1 && this.subjectList[this.topicindex].subjectType != 3) {
					uni.showToast({
						title: "已是最后一题",
						icon: "none"
					})


					this.topicindex = this.subjectList.length - 1
					return
				}

				if (this.subjectList[this.topicindex].subjectType == 3 || this.subjectList[this.topicindex].subjectType ==
					1) {
					this.isshowtthree = true
					setTimeout(() => {

						this.topicindex++
						this.isshowtthree = false

					}, 1500)
				} else if (this.subjectList[this.topicindex] && this.subjectList[this.topicindex].subjectType == 2 && this
					.subjectList[this.topicindex].standardAnswer) {
					this.textcontent = this.subjectList[this.topicindex].standardAnswer
					this.textshow = true

					setTimeout(() => {
						this.textshow = false
						this.topicindex++
						this.isshowtthree = false

					}, 2000)

				} else

				{
					this.isshowtthree = false
					this.topicindex++
				}


			},
			containsArrayValue(str, arr) {
				return arr.some(value => str.includes(value));
			},
			goshop(url) {

				window.location.href = this.jumpShopLink
			},
			gorest() {
				location.reload();
				this.resttype = true
				this.showpopup = false
				this.showpopupsuccess = false
				// setTimeout(() => {
				// 	this.resttype = false
				// }, 5)
				this.topicindex = 0
				// this.getlist()
			},
			failclose() {

				if (this.resttype) {
					return

				} else {
					uni.navigateBack({
						delta: 1,
					});
				}

				// uni.navigateBack({
				// 	delta: 1,
				// });
			},
			failcloseout() {
				uni.navigateBack({
					delta: 1,
				});
			},
			failclosesuccess() {
				console.log("sdsada", this.resttype)
				if (this.resttype) {
					return
				}
				uni.navigateBack({
					delta: 1,
				});
			},
			gohome() {
				uni.reLaunch({
					url: "/pages/home/index"
				})
			},
			golist() {
				uni.reLaunch({
					url: "/pages/activity/index"
				})
			},
			async getlist() {
				this.subjectList = []
				this.inpayimg = null
				const resindex = await beginActivity(JSON.stringify(this.form))

				if (resindex.result == 0) {
					console.log(resindex)
					if (resindex.examineFlag && resindex.examineFlag == 1) {
						this.showpopup = true
					}
					this.resttype = false
					if (resindex.examineFlag && resindex.examineFlag == 0) {
						this.showpopupsuccess = true
						this.surplusJoinNum = resindex.surplusJoinNum
						this.rewardPoint = resindex.rewardPoint
						this.successFlag = resindex.successFlag

					}

					uni.setNavigationBarTitle({
						title: resindex.activity && resindex.activity.title ? resindex.activity.title :
							"党建" // 新标题内容
					});

					if (!resindex.subjectList) {
						return
					}

					//   that.joinRecordId=resindex.activity.joinRecordId
					//   that.sportStep=resindex.activity.sportStep
					// that.whiteListId=resindex.activity.whiteListId
					// 				that.getdataobj(res.encryptedData,res.iv)
					if (resindex.subjectList && resindex.subjectList.length > 0) {

						resindex.subjectList.forEach((element, index) => {
							console.log(element, "sasd")
							if (element.titleType && element.titleType == 2) {
								element.subjectImagelist = element.subjectImage.split("|")

								element.subjectImagelist.forEach((element3, index3) => {
									let str = this.imgurl + element3
									element.subjectImagelist[index3] = str
									// 		element.subjectImagelist[index3]={}
									// 		element.subjectImagelist[index3]={
									// 	image:str,
									// 	title:"111",
									// }							
									console.log(element3, "element3")


								})


							}

							console.log(element.subjectImagelist)
							if (element.subjectType == 2) {
								element.content = ""
							}
							element.select = false
							if (element.optionList.length > 0) {
								element.optionList.forEach((element2, index2) => {
									element2.select = false

								})
							}
						})
					}

					this.subjectList = resindex.subjectList
					this.shuoming = resindex.activity.rule
					this.joinRecordId = resindex.activity.joinRecordId
					this.whiteListId = resindex.activity.whiteListId
					this.inpayimg = resindex.activity.posterBackdropImg
					app.globalData.data.inpayimg = this.inpayimg

					this.sectionInfo.type_config.video_url = BASE_URL_IMAHE + resindex.activity.videoTutorial




				} else if (resindex.result == -100) {
					// -100 不在活动白名单
					this.noinshow = true

				} else if (resindex.result == -101) {
					// -101 已参与活动
					this.failshow = true

				} else if (resindex.result == -102) {
					// -101 已参与活动
					this.norsshow = true

				} else {
					uni.showToast({
						title: "数据错误",
						icon: "none"
					})
				}

				// 		const res=await getHistoryPage(JSON.stringify(this.form))
				// 		console.log(res)
				// this.toall=Math.ceil(res.page.count/res.page.pageSize)
				// this.historylist.push(...res.page.list)
				// this.form.pageNo++
			},
			async submitfun() {


				var subjectArr = []
				var submitselect = true
				// subjectId：题目Id
				// optionId：选项Id
				// answer：选项对错(传0或1)
				// content：填空题的内容
				this.subjectList.forEach((element, index) => {

					if (element.subjectType == 1) {
						if (!element.select) {
							submitselect = false
						}
						element.optionList.forEach((element1, index1) => {
							if (element1.select) {
								if (element1.optionAnswer == 1) {
									subjectArr.push({
										subjectId: element.id,
										optionId: element1.id,
										answer: 1,
										content: ""

									})
								} else {
									subjectArr.push({
										subjectId: element.id,
										optionId: element1.id,
										answer: 0,
										content: ""

									})
								}

							}


						})

					} else if (element.subjectType == 2) {
						if (!element.content) {

							submitselect = false
						}
						subjectArr.push({
							subjectId: element.id,
							content: element.content

						})
					} else if (element.subjectType == 3) {
						let selectid = ""
						if (!element.select) {
							submitselect = false
						}
						element.optionList.forEach((element1, index1) => {

							if (element1.select) {
								if (selectid) {
									selectid = selectid + ',' + element1.id
								} else {
									selectid = element1.id
								}


							}


						})

						subjectArr.push({
							subjectId: element.id,
							optionId: selectid,
							answer: '',
							content: ""

						})

					}
				})

				if (!submitselect) {
					uni.showToast({
						title: "您有题目未作答，请先完成题目",
						icon: "none"
					})
					return
				}

				this.nextfun(2)
				var res = null
				var data = null
				setTimeout(async () => {


					data = {
						activityId: this.form.activityId,
						whiteListId: this.whiteListId,
						joinRecordId: this.joinRecordId,
						userRef: this.form.userRef,
						token: this.token,
						subjectArr: subjectArr,

					}

					console.log(this.topicindex, this.subjectList, "sdsd")

					if (this.subjectList[this.subjectList.length - 1] && this.subjectList[this.subjectList
							.length - 1].subjectType == 2) {
						this.textcontent = this.subjectList[this.topicindex].standardAnswer
						this.textshow = true
						setTimeout(async () => {
							res = await submitAnswer(JSON.stringify(data))

							this.textshow = false
							if (res.result == 0) {

								this.jumpShopLink = res.jumpShopLink ? res.jumpShopLink : ""
								if (res.examineFlag == 1) {
									this.showpopup = true
								}
								if (res.examineFlag == 0) {
									// this.showpopupsuccess=true
									this.surplusJoinNum = res.surplusJoinNum
									this.rewardPoint = res.rewardPoint
									this.successFlag = res.successFlag
									this.showpopupsuccess = true

								}

							} else {
								uni.showToast({
									title: res.message,
									icon: 'none',
								});
								var sjs = this.randomWord()
								var datatime = Date.parse(new Date());
								var tokens = '' + sjs + '' + datatime
								this.token = tokens
							}

						}, 2000)



						return


					}

					res = await submitAnswer(JSON.stringify(data))

					// if

					if (res.result == 0) {
						this.jumpShopLink = res.jumpShopLink ? res.jumpShopLink : ""
						if (res.examineFlag == 1) {
							this.showpopup = true
						}
						if (res.examineFlag == 0) {
							// this.showpopupsuccess=true
							this.surplusJoinNum = res.surplusJoinNum
							this.rewardPoint = res.rewardPoint
							this.successFlag = res.successFlag
							this.showpopupsuccess = true

						}

					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
						});
						var sjs = this.randomWord()
						var datatime = Date.parse(new Date());
						var tokens = '' + sjs + '' + datatime
						this.token = tokens
					}
				}, 1500)

			},
			//获取
			async cjfun() {
				// this.showpopup=true
				// return
				var data = {
					activityId: this.form.activityId,
					whiteListId: this.whiteListId,
					joinRecordId: this.joinRecordId,
					userRef: this.form.userRef,
					token: this.token,
					subjectArr: subjectArr,

				}
				var res = await submitAnswer(JSON.stringify(data))

				if (res.result == 0) {
					this.jumpShopLink = res.jumpShopLink
					if (res.examineFlag == 1) {
						this.showpopup = true
					}
					if (res.examineFlag == 0) {
						this.surplusJoinNum = res.surplusJoinNum
						this.rewardPoint = res.rewardPoint
						this.successFlag = res.successFlag
						this.showpopupsuccess = true

					}

				} else {
					var sjs = this.randomWord()
					var datatime = Date.parse(new Date());
					var tokens = '' + sjs + '' + datatime
					this.token = tokens
				}

			},

			// 监听播放进度
			bindtimeupdate(e) {
				// return
				var currentTime = e.detail.currentTime; //当前进度
				var duration = e.detail.duration; //视频时长

				//视频播放完成后触发奖励保存接口
				let percent = 100; //播放进度百分比，可以改成 80 或者90等其它数字，到达时触发奖励保存
				// let percent = this.sectionInfo.type_config.video_complate_rate;
				let upper = duration * (percent / 100);
				if (currentTime >= upper) {
					if (this.isTo) {
						this.isTo = false; //isTo 奖励加锁，进入页面只能触发一次

						console.log('触发奖励请求接口');
						// this.$request(this.$api.Weike.sectionComplete, this.options).then((res) => {});
					}
				}

				// 禁止拖动进度条快进
				if (currentTime - this.historyTime > 2) {
					uni.showToast({
						title: '不能快进哦',
						icon: 'none',
					});
					let videoContext = wx.createVideoContext('myVideo');
					videoContext.seek(this.historyTime);
				}
				this.historyTime = currentTime;
			},
			randomWord() {
				var chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I',
					'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 'a', 'b', 'c',
					'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w',
					'x', 'y', 'z'
				];
				var nums = "";
				for (var i = 0; i < 20; i++) {
					var id = parseInt(Math.random() * 61);
					nums += chars[id]
				}
				return nums;
			},
		}
	}
</script>
<style scoped lang="scss">
	.party {
		width: 100%;
		height: 100vh;
		position: relative;

		.party-bc {
			width: 100%;
			height: 100%;
			display: flex;
			justify-content: center;
			align-items: center;
			overflow: hidden;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.party-view {
			width: 630rpx;
			position: absolute;
			top: 160rpx;
			left: -315rpx;
			text-align: center;
			margin-left: 50%;

			// margin: 0 auto;
			.text-images {
				margin-top: 33rpx;
				width: 100%;

				image {
					width: 100%;
				}
			}

			.text-input {
				background-color: #ffffff;
				border-radius: 25rpx;
				padding: 10rpx;
				margin-top: 33rpx;
			}

			.party-icon {
				text-align: center;

				image {
					width: 120rpx;
				}
			}

			#myVideo {
				width: 100%;
				height: 465rpx;
			}

			.party-view-top {
				font-size: 48rpx;
				text-align: center;
				font-weight: bold;
				color: #8e110e;
				margin-bottom: 45rpx;

			}

			.select-text {
				width: 100%;
				height: 110rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding-left: 43rpx;
				padding-right: 34rpx;
				background-color: white;
				border-radius: 15rpx;
				margin-top: 33rpx;
				// border: 1rpx solid #cbcbcb;
				// box-shadow:  #718096;
				box-shadow: 2rpx 2rpx 10rpx 1rpx #d5d5d5;

				.select-text-left {
					display: flex;
					align-items: center;

					.select-text-titleicon {
						image {
							width: 48rpx;
							height: 48rpx;
						}
					}

					.select-text-title {
						font-size: 28rpx;
						margin-left: 30rpx;
					}

				}

				.select-text-right {
					image {
						width: 48rpx;
						height: 48rpx;
					}
				}

			}

			.bt-k {
				width: 100%;
				// display: flex;
				// justify-content: center;
				margin-top: 40rpx;
			}

			.bt-ktj {
				width: 100%;
				margin-top: 40rpx;
			}

		}
	}


	.bt-dk {
		width: 150rpx;
		height: 75rpx;
		background-color: #ffffff;
		border-radius: 50rpx;
		font-size: 30rpx;
		font-weight: bold;
		color: #8e110e;
		text-align: center;
		line-height: 75rpx;
		margin: 125rpx auto 0rpx;
	}


	.popup {
		position: fixed;
		width: 100%;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.5);
		top: 0;
		left: 0;
		display: flex;
		justify-content: center;
		align-items: center;

		.popup-k {
			image {
				width: 530rpx;
			}

			.bt {
				position: relative;
				width: 400rpx;
				height: 88rpx;
				background-color: #48db8d;
				color: #ffffff;
				font-size: 32rpx;
				font-weight: bold;
				text-align: center;
				line-height: 88rpx;
				margin: -95rpx auto 0;
				z-index: 1;
				border-radius: 50rpx;
			}
		}
	}

	// 弹框
	.fail-k {
		width: 490rpx;
		height: 405rpx;
		box-sizing: border-box;
		// padding-top: 29rpx;
		text-align: center;
		// background: url("/static/images/popup-icon.png") no-repeat;
		background-size: 100% 100%;
		background-attachment: fixed;

		.fail-image-icon {
			image {
				width: 231rpx;
				height: 231rpx;
			}
		}

		.fail-title {
			padding-top: 120rpx;
			font-size: 36rpx;
			font-weight: bold;
			color: #111827;
		}

		.fail-content {
			padding-top: 29rpx;
			font-size: 36rpx;
			font-weight: bold;
			color: #111827;
		}

		.fail-bt {
			margin: 55rpx auto 0rpx;
			width: 188rpx;
			height: 64rpx;
			background-color: #730017;
			font-size: 18rpx;
			color: #ffffff;
			border-radius: 35rpx;
			line-height: 64rpx;

		}

	}

	.fail-kan {
		padding-top: 100rpx;
		height: 800rpx;
		width: 600rpx;

		.fail-title {
			padding-top: 20rpx;
			color: #8a0002;
			font-size: 38rpx;
		}

		.fail-num {
			font-size: 120rpx;
			color: #8a0002;
		}

		.fail-max {
			margin-top: 40rpx;
			font-size: 24rpx;
			color: #000000;
		}

		.fail-content {
			font-size: 24rpx;
			padding-top: 64rpx;
			color: #8a0002;
			white-space: pre-wrap;
		}

		.fail-bt {
			margin: 55rpx auto 0rpx;
			width: 492rpx;
			height: 95rpx;
			background-color: #730017;
			font-size: 30rpx;
			color: #ffffff;
			border-radius: 15rpx;
			line-height: 95rpx;

		}

		.fail-bt-new {
			margin: 15rpx auto 0rpx;
			width: 492rpx;
			height: 95rpx;
			background-color: #ffffff;
			font-size: 30rpx;
			color: #730017;
			box-sizing: border-box;
			border: 2rpx solid #730017;
			border-radius: 15rpx;
			line-height: 95rpx;
		}
	}

	.showpopupsuccess {
		padding-top: 50rpx;
		height: auto;
		padding-bottom: 80rpx;
	}

	.jnshow-k {
		width: 650rpx;
		height: auto;
		padding-bottom: 40rpx;

		.jnshow-title {
			padding-top: 50rpx;
			font-size: 36rpx;
			font-weight: bold;
			color: #111827;
		}

		.jnshow-content {
			margin-top: 29rpx;
			font-size: 24rpx;
			font-weight: bold;
			color: #718096;
			padding: 0 20rpx;
			white-space: pre-wrap;
			text-align: left;
		}
	}

	.po-k {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background-color: #FFFFFF;
		z-index: 1000;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.hd_jn {
		position: absolute;
		top: 29rpx;
		right: 16rpx;
		z-index: 10;
		font-size: 20rpx;
		text-align: center;
		color: #39393d;

		image {
			width: 90rpx;
			height: 92rpx;
			margin-bottom: 10rpx;
		}
	}

	.payshow-k {
		width: 720rpx;
		height: auto;
		max-height: 90vh;
		// padding-bottom: 100rpx;
		position: relative;


		.jnshow-title {
			padding-top: 50rpx;
			font-size: 36rpx;
			font-weight: bold;
			color: #111827;
		}

		.jnshow-content {
			margin-top: 29rpx;
			font-size: 24rpx;
			font-weight: bold;
			color: #718096;
			padding: 0 20rpx;
			white-space: pre-wrap;
			text-align: left;
			padding-bottom: 200rpx;
		}

		.payshow-bt {
			width: 100%;
			display: flex;
			justify-content: center;
			align-items: center;
			position: absolute;
			bottom: 50rpx;
			font-size: 20rpx;

			button {
				background-color: #f1c16e;
				padding: 20rpx 40rpx;
				color: #ffffff;
			}
		}
	}

	.fail-list-text {
		padding-top: 80rpx;
		padding-left: 20rpx;
		padding-right: 20rpx;
		padding-bottom: 120rpx;
		white-space: wrap;
	}
</style>